<template>
  <view>
    <view class="">
      <view class="from">
        <view class="work_title_module">
          <u-cell-group :border="false">
            <u-cell-item :arrow="false">
              <view class="title" slot="title">
                <text>出租类型</text>
              </view>
              <view style="width: 400rpx; text-align: left">
                <input
                  v-model="form.type"
                  disabled
                  placeholder="选择出租类型"
                  :clearable="false"
                  :inputBorder="false"
                />
              </view>
              <u-icon slot="right-icon" name="/static/enter.png" size="28"></u-icon>
            </u-cell-item>
            <u-cell-item :arrow="false">
              <view class="title" slot="title">
                <text>租金</text>
              </view>
              <view style="width: 400rpx; text-align: left">
                <input
                  v-model="form.contactName"
                  placeholder="请输入租金"
                  :clearable="false"
                  :inputBorder="false"
                  type="digit"
                />
              </view>
              <view slot="right-icon" style="font-weight: bold; font-size: 30rpx">元/月</view>
            </u-cell-item>
            <u-cell-item :arrow="false">
              <view class="title" slot="title">
                <text>户型</text>
              </view>
              <view style="width: 400rpx; text-align: left">
                <input
                  v-model="form.area"
                  disabled
                  placeholder="请选择户型"
                  :clearable="false"
                  :inputBorder="false"
                />
              </view>
              <u-icon slot="right-icon" name="/static/enter.png" size="28"></u-icon>
            </u-cell-item>
            <u-cell-item :arrow="false">
              <view class="title" slot="title">
                <text>面积</text>
              </view>
              <view style="width: 400rpx; text-align: left">
                <input
                  v-model="form.contactName"
                  placeholder="请输入面积"
                  :clearable="false"
                  :inputBorder="false"
                  type="digit"
                />
              </view>
              <view slot="right-icon" style="font-weight: bold; font-size: 30rpx">㎡</view>
            </u-cell-item>
            <u-cell-item :arrow="false">
              <view class="title" slot="title">
                <text>楼层</text>
              </view>
              <view style="width: 400rpx; text-align: left">
                <input
                  v-model="form.contactName"
                  placeholder="请输入楼层"
                  :clearable="false"
                  :inputBorder="false"
                  type="digit"
                />
              </view>
              <view slot="right-icon" style="font-weight: bold; font-size: 30rpx">层</view>
            </u-cell-item>
            <u-cell-item :arrow="false">
              <view class="title" slot="title">
                <text>装修</text>
              </view>
              <view style="width: 400rpx; text-align: left">
                <input
                  v-model="form.area"
                  disabled
                  placeholder="请选择装修类型"
                  :clearable="false"
                  :inputBorder="false"
                />
              </view>
              <u-icon slot="right-icon" name="/static/enter.png" size="28"></u-icon>
            </u-cell-item>

            <!-- <u-cell-item @click="onPicker(5)" :arrow="false"> -->
            <u-cell-item @click="chooseAddressView()" :arrow="false">
              <view class="title" slot="title">
                <text>房屋地址</text>
              </view>
              <view style="width: 400rpx; text-align: left">
                <input
                  v-model="form.area"
                  disabled
                  placeholder="请选择房屋位置"
                  :clearable="false"
                  :inputBorder="false"
                />
              </view>
              <u-icon slot="right-icon" name="/static/dw-g-l.png" size="42"></u-icon>
            </u-cell-item>
            <view style="padding: 26rpx 32rpx">
              <view class="title" style="width: 100%">
                <text>其他说明</text>
              </view>
              <view>
                <textarea class="textarea" placeholder="请输入信息内容" />
              </view>
            </view>
          </u-cell-group>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  name: 'house-cz',
  props: {},
  data() {
    return {
      current: 0,
      form: {}
    }
  },
  methods: {
    //选择地址、修改编辑地址
    chooseAddressView(index) {
      uni.chooseLocation({
        success: (res) => {
          console.log('res', res)
          if (!res.name || !res.address || !res.latitude || !res.longitude) return
          // let addressObj = {
          // 	title: res.name,
          // 	address: res.address,
          // 	latitude: res.latitude,
          // 	longitude: res.longitude
          // }
          // console.log('addressObj', addressObj)
          this.form.latitude = res.latitude
          this.form.longitude = res.longitude
          this.form.countyCode = countyCode
          this.form.detailAddress = res.address
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
input {
  font-size: 30rpx;
  color: #333333;
}
.cell-right {
  margin-right: 100rpx;
}
.from {
  .custom_modules {
    padding-left: 20rpx;
  }
  .title {
    font-size: 30rpx;
    width: 200rpx;
    font-weight: 600;
  }
  .textarea {
    width: 686rpx;
    height: 140rpx;
    background: #f5f5f5;
    border-radius: 10rpx;
    margin-top: 20rpx;
    line-height: 50rpx;
    padding: 20rpx;
    box-sizing: border-box;
    box-lines: 2;
  }
}
.upload-group {
  width: 100%;
  margin-top: 28rpx;

  .slot-btn {
    // margin-top: 28rpx;
    position: relative;
    width: 330rpx;
    height: 240rpx;
    background-position: center;
    background-size: cover;
    display: flex;
    align-items: center;
    justify-content: center;

    .des {
      text-align: center;

      .des-text {
        font-size: 24rpx;
        color: #10a28f;
      }
    }
  }
}
</style>
